<template>
    <div>{{dateTime}}</div>
</template>

<script>
import { defineComponent,onMounted,ref } from 'vue';
export default defineComponent({
    setup() {
        const dateTime = ref(null);
        onMounted(()=>{
            const getTime = ()=>{
                let weekdays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
                let date = new Date();
                let year = date.getFullYear();
                let month = date.getMonth()+1;
                let day = date.getDate();
                let weekday = date.getDay();
                let h = date.getHours();
                let m = date.getMinutes();
                let s = date.getSeconds()
                if(month<10){
                    month='0'+month;
                }
                if(day<10) {
                    day='0'+day;
                }
                if(h<10) {
                    h='0'+h;
                }
                if(m<10) {
                    m='0'+m;
                }
                if(s<10) {
                    s='0'+s;
                }

                dateTime.value = year+'-'+month+'-'+day+' '+weekdays[weekday]+' '+h+':'+m+':'+s;
            }
            getTime();
            setInterval(getTime,1000);
        });

        return {
            dateTime
        }
    }
})
</script>